import { defineStore } from 'pinia'
import { ref } from 'vue'

export const useSystemStore = defineStore('system', () => {
  // 状态栏高度
  const statusBarHeight = ref(uni.getSystemInfoSync().statusBarHeight)

  // 系统底部安全区域高度
  const systemBottom = ref(uni.getSystemInfoSync().safeAreaInsets?.bottom)

  // cutom头部页面内容的包裹样式
  const warrperStyle = { 'padding-top': statusBarHeight.value + 'px', height: `calc(100vh - ${statusBarHeight.value}px)` }

  // 胶囊按钮的高度
  const menuButtonHeight = ref(uni.getMenuButtonBoundingClientRect()?.height ?? 0)

  return {
    statusBarHeight,
    systemBottom,
    warrperStyle,
    menuButtonHeight
  }
})
